<template>
    <div class="task-my-task-filter-container">
        <CheckboxGroup v-model="selection">
            <Checkbox label="已完成"></Checkbox>
            <Checkbox label="已截止"></Checkbox>
        </CheckboxGroup>
        <Select v-model="option" class="task-my-task-select">
            <Option v-for="item in options" :value="item.value" :key="'my-task-options-' + item.value">
                {{ item.context }}
            </Option>
        </Select>
    </div>
</template>

<script>

import local_vuex from "@task/js/vuex";

export default {
    data() {
        return {
            options: [
                {
                    value: -1,
                    context: "全部"
                },
                {
                    value: 0,
                    context: "部门"
                },
                {
                    value: 1,
                    context: "小组"
                },
                {
                    value: 2,
                    context: "个人"
                }
            ],
            selection: [],
            option: -1
        }
    },
    mounted() {
        local_vuex.state.myTask.type = this.option;
        local_vuex.state.myTask.complete = this.swit ? 1 : 0;
    },
    watch: {
        option(v) {
            local_vuex.state.myTask.type = v;
            this.$emit("on-change");
        },
        selection() {
            local_vuex.state.myTask.close = this.selection.indexOf("已截止") == -1 ? 0 : 1;
            local_vuex.state.myTask.complete = this.selection.indexOf("已完成") == -1 ? 0 : 1;
            this.$emit("on-change");
        }
    }
}
</script>

<style lang="scss">
@import "@task/scss/my-task-filter.scss";
</style>